<template>
  <div>
    <div style="text-align: right;">
      <el-button type="primary" @click="doReturn">返回</el-button>
      <el-button type="primary" @click="doSubmit(mergeForm)">确 定</el-button>
    </div>
    <br />

    <el-form :model="mergeForm" :rules="mergeFormRules" ref="mergeForm" label-width="100px">
      <el-form-item label="用户名" prop="username">
        <el-input v-model="mergeForm.username" autocomplete="off" class="disabled"></el-input>
      </el-form-item>
      <el-form-item label="密码" prop="password">
        <el-input type="password" v-model="mergeForm.password" autocomplete="off" class="disabled"></el-input>
      </el-form-item>
      <el-form-item label="确认密码" prop="password2">
        <el-input type="password" v-model="mergeForm.password2" autocomplete="off" class="disabled"></el-input>
      </el-form-item>
      <el-form-item label="邮箱" prop="email">
        <el-input v-model="mergeForm.email" autocomplete="off" class="disabled"></el-input>
      </el-form-item>
      <el-form-item label="手机号" prop="mobile">
        <el-input v-model="mergeForm.mobile" autocomplete="off" class="disabled"></el-input>
      </el-form-item>
      <el-form-item label="状态" prop="status">
        <el-radio v-model="radio" label="0">正常</el-radio>
        <el-radio v-model="radio" label="1">禁用</el-radio>
      </el-form-item>
    </el-form>

    <!--      <el-form :model="mergeForm" :rules="mergeFormRules" ref="mergeForm" label-width="100px">
    <el-form-item label="角色" prop="svrStatus">
      <template>
        <el-checkbox-group v-model="checkList">
          <el-checkbox label="商家管理员 A"></el-checkbox>
          <el-checkbox label="门店人员 B"></el-checkbox>
          <el-checkbox label="平台运营者 C"></el-checkbox>
        </el-checkbox-group>
      </template>
    </el-form-item>
  </el-form> -->

  </div>
</template>

<script>
  export default {
    data() {
      var password = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入密码'))
        } else if (value < 2) {
          callback(new Error('密码长度最少 2 个字符'))
        } else {
          if (this.mergeForm.password2 !== '') {
            this.$refs.mergeForm.validateField('password2');
          }
          callback();
        }
      }
      var password2 = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请再次输入密码'));
        } else if (value !== this.mergeForm.password) {
          callback(new Error('两次输入密码不一致!'));
        } else {
          callback();
        }
      }
      return {
        mergeForm: {
          username: null,
          password: null,
          email: null,
          mobile: null,
          status: null
        },
        mergeFormRules: {
          username: [{
            required: true,
            message: '用户名不能为空',
            trigger: 'blur'
          }],
          password: [{
            validator: password,
            trigger: 'blur'
          }],
          password2: [{
            validator: password2,
            trigger: 'blur'
          }],
          email: [{
            required: true,
            message: '邮箱不能为空',
            trigger: 'blur'
          }],
          mobile: [{
            required: true,
            message: '手机号不能为空',
            trigger: 'blur'
          },{
            max: 11,
            message: '请输入正确的手机号',
            trigger: 'blur'
          }],
          status: []
        },
        radio: '0'
      }
    },
    methods: {
      doSubmit: function(mergeForm) {
        this.$refs['mergeForm'].validate((valid) => {
          if (valid) {
            this.mergeForm.status = this.radio
            // alert(this.mergeForm.status)
            this.axios.post(this.axios.urls.SYS_USER_MERGE, this.mergeForm).then((response) => {
              this.$message({
                type: 'success',
                message: response.data.message
              })
            })
            this.$router.push('/AppMain/userList')
          }
        })
      },
      resetForm(mergeForm) {
        this.$refs[mergeForm].resetFields();
      },
      doReturn: function() {
        this.$router.push('/AppMain/userList')
      }
    }
  }
</script>

<style>
</style>
